<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>traverse</title>
<script src='../lib/jquery-2.1.1.js'></script>
<script>
$(document).ready(function(){
	//traver를 사용하여 6번째 요소의 색상 변경
	$('li').eq(5).css('color','#00ffff');
	
	//traverse의 filter를 사용하여 3의 배수번째의 색상
	$('#mnt>li').filter(function(index){
		return index%3==0;
	}).css('color','#ff0000');

	//silce를 사용하여 2~4까지 항목에 border를 지정
	$('#mnt>li').slice(2,4).css('border','1px solid #ff00ff');
});



</script>
</head>
<body>
<h3>Traverse Example<hr/></h3>
<ul id='mnt'>
	<li>백두산</li>
	<li>금강산</li>	
	<li>설악산</li>
	<li>한라산</li>
	<li>치악산</li>
	<li>청계산</li>
	<li>북한산</li>
	<li>지리산</li>
	<li>내장산</li>
</ul>
</body>
</html>